<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>1_类的基本知识</title>
</head>
<body>
<script type="text/javascript">
    /*
    * 总结
    *   1·类中的构造器不是必须写的，要对实例进行一些初始化的操作，如添加指定属性时才写
    *   2·如果A类继承类B类，且A类中写类构造器，那么A类中的super是必须要调用的
    *   3·类中所定义的方法，都是放在了类的原型对象上，供实例去使用
    * */

    //创建一个Person类
    class Person {
        //构造器方法
        constructor(name, age) {
            //构造器中的this是谁？- 类的实例对象
            this.name = name
            this.age = age
        }

        //一般方法
        speak() {
            //speak方法放在哪里？- 类的原型对象上
            //speak方法是给谁用的？- 实例使用
            //speak方法中的this是谁？- 通过实例调用时，谁调用，this就是谁
            console.log(`我叫${this.name}，我年龄是${this.age}`)
        }

    }

    //创建一个Student类，继承Person
    class Student extends Person {
        constructor(name, age, grade) {
            super(name, age);
            this.grade = grade
        }

        //重写父类方法
        speak() {
            console.log(`我叫${this.name}，我年龄是${this.age},我现在${this.grade}`)
        }

        study() {
            console.log(this)
            //study方法放在了哪里？- 类的原型树上，供实例使用
            //通过Student实例调用study方法时，study中的this就是Student实例
            console.log(`我很努力的学习`)
        }
    }

    //创建一个Person的实例对象
    let person1 = new Person('tom', 18);
    let person2 = new Person('json', 19);
    console.log(person1)
    console.log(person2)
    person1.speak()
    person2.speak()

    let student = new Student('校长', 28, '校长室')
    console.log(student)
    student.speak()
    student.study()

    class Car {
        constructor(name, price) {
            this.name = name
            this.price = price
        }

        //类里可以直接写赋值语句，如下代码的含义是，给Car的实例对象添加一个属性，比如a=1
        a = 1
    }

    let car1 = new Car('奔驰', 199);
    let car2 = new Car('宝马', 271);
    console.log(car1)
    console.log(car2)
</script>
</body>
</html>